<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">

<ui:composition template="/templates/template.xhtml">
	<p:growl id="growl" showDetail="true" sticky="true" />
	<ui:define name="title">
		Relatorio Compras
	</ui:define>

	<ui:define name="head">
		<style type="text/css">
#panelGrid1 {
	width: 100%;
	border-style: none;
	border-width: 0px;
}

.colunaPanelGrid1 {
	border-width: 0px;
	border-style: none;
}

.colDir {
	text-align: right;
}

.colEsq {
	text-align: left;
}
</style>

	</ui:define>

	<ui:define name="centro">
		<h:form id="form1" prependId="false">
			<p:panel id="painelEdicao" >
				<f:facet name="header">
					<h:outputText value="Relatorio de Compras" />
				</f:facet>
				<h:panelGrid columns="2" width="99%">
					<h:outputLabel value="Data Inicial:" for="dataInicial" id="lblDataInicial" />
					<p:calendar value="#{relatorioComprasMB.dataInicial}" id="dataInicial" showOn="button" />
					<h:outputLabel value="Data Final:" for="dataFinal" id="lblDataFinal" />   
					<p:calendar value="#{relatorioComprasMB.dataFinal}" id="dataFinal" showOn="button" />   
				</h:panelGrid>

				<f:facet name="footer">
					<p:commandButton value="#{lbls.LBL_0078}" icon="ui-icon-cancel"
						update="compraDataTable" process="@this dataInicial dataFinal"
						action="#{relatorioComprasMB.doListarAction}" />

				</f:facet>

				<p:confirmDialog id="confirmDialog" message="#{msgs.MSG_0002}"
					appendToBody="true" header="#{msgs.MSG_0003}" severity="alert"
					widgetVar="confirmation">

					<p:commandButton id="decline" value="#{lbls.LBL_0012}"
						onclick="confirmation.hide()" type="button" />

				</p:confirmDialog>
			</p:panel>

			<p:dataTable id="compraDataTable" var="compra" paginator="true"
				rows="5" emptyMessage="#{lbls.LBL_0004}" paginatorPosition="bottom"
				rowKey="#{compra.id}" value="#{relatorioComprasMB.listaCompras}"
				paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}">
				<p:column style="width:10px;">
					<f:facet name="header">
						<h:outputText value="Cód" />
					</f:facet>
					<div align="center">
						<h:outputText value="#{compra.id}" />
					</div>
				</p:column>
				
				<p:column style="text-aling:center;">
					<f:facet name="header">
						<h:outputText value="Data - Hora" />
					</f:facet>
					<h:outputText value="#{compra.dataCompra}" >
					<f:convertDateTime pattern="dd/MM/yyyy - HH:mm"  />
					</h:outputText>
				</p:column>

				<p:column>
					<f:facet name="header">
						<h:outputText value="Valor c/ Desc.(R$)" />
					</f:facet>
					<h:outputText value="#{compra.valorPago}" >
					<f:convertNumber type="currency"  currencySymbol=""/>
					</h:outputText>
				</p:column>
				
				
				<p:column>
					<f:facet name="header">
						<h:outputText value="Valor (R$)" />
					</f:facet>
					<h:outputText value="#{compra.valorTotal}" >
					<f:convertNumber type="currency"  currencySymbol=""/>
					</h:outputText>
				</p:column>
				
				
				<p:column style="width:40px">
					<p:commandButton id="showDialogButton" icon="ui-icon-search"
						oncomplete="compraDialog.show()" action="#{relatorioComprasMB.doBuscarCompraAction}" process="@this" update="@(#itemCompraDataTable, #dadosCompra)">
							<f:setPropertyActionListener value="#{compra}"
									target="#{relatorioComprasMB.compraSelecionada}" />
					</p:commandButton>

				</p:column>

			</p:dataTable>
			
			
		    <p:dialog id="dialog" header="Detalhes da compra" widgetVar="compraDialog" resizable="true"  
		    modal="true" appendToBody="true"
                showEffect="explode" hideEffect="explode" maximizable="true" >  

		
			<p:panelGrid columns="3" id="dadosCompra">
				<h:outputText value="Data:" />
				<h:outputText value="#{relatorioComprasMB.compraSelecionada.dataCompra}" >
					<f:convertDateTime />		
				</h:outputText>
			</p:panelGrid>
			
			<p:dataTable id="itemCompraDataTable" var="itemCompra" paginator="true"
				rows="15" emptyMessage="#{lbls.LBL_0004}" paginatorPosition="bottom"
				value="#{relatorioComprasMB.listaItemCompra}"
				paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}">
				
				<p:column>
					<f:facet name="header">
						<h:outputText value="Produto" />
					</f:facet>
					<h:outputText value="#{itemCompra.produto.descricao}" />
					
					<f:facet name="footer">
						<h:outputText value="Total:" style="text-align:right"/>
					</f:facet>
				</p:column>
				
				<p:column styleClass="colDir" style="width: 30px;">
					<f:facet name="header">
						<h:outputText value="Qtda." />
					</f:facet>
					<h:outputText value="#{itemCompra.quantidade}" />
					
					<f:facet name="footer">
						<h:outputText value="#{relatorioComprasMB.totalItensComprado}" style="text-align:right"/>
					</f:facet>
				</p:column>
				
				<p:column styleClass="colDir" style="width: 90px;">
						<f:facet name="header">
							<h:outputText value="#{lbls.LBL_0049} (R$)" />
						</f:facet>
						<h:outputText
							value="#{itemCompra.produto.valorVenda * itemCompra.quantidade}">
							<f:convertNumber type="currency"  currencySymbol=""/>
						</h:outputText>
						
						<f:facet name="footer">
							<h:outputText value="#{relatorioComprasMB.compraSelecionada.valorTotal}" >
								<f:convertNumber type="currency"  currencySymbol=""/>
							</h:outputText>
						</f:facet>
								
				</p:column>
				
			</p:dataTable>
			</p:dialog>
		</h:form>

	</ui:define>
</ui:composition>
</html>